<template>
    <dv-border-box-11 title="今日订单" style="width:100%; height:400px;" >
      <div style="    padding-top: 65px;padding-left: 15%;padding-right: 10%;">
        <!-- <dv-scroll-board :config="config" style="width:80%;height:300px" /> -->
        <dv-scroll-ranking-board :config="{data:props.data.record}" style="width:80%;height:300px" />
      </div>
    
</dv-border-box-11>
           <!-- <dv-border-box-3 class="rmctc-chart-1">
  <div class="left-chart-1">
    <div class="lc1-header">
      今日扫码订单
    </div>
    <div class="lc1-details">
      <span>{{count}}</span>
    </div>
    <dv-capsule-chart class="lc1-chart" :config="state.config" />
    <dv-decoration-2 style="height:10px;" />
  </div>
</dv-border-box-3> -->

</template>

<script lang="ts" setup>
import { reactive,ref,watch , onMounted} from 'vue';
const count=ref(0);
interface IrightchartProps {
  data: any;
}
const props = defineProps<IrightchartProps>();
console.log(props.data);
const data=ref(props.data);




watch(props.data,()=>{
  debugger;

})
</script>

<style lang="less">
.left-chart-1 {
  width: 95%;

  display: flex;
  flex-grow: 0;
  flex-direction: column;

  .lc1-header {
    text-align: center;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 30px;
    margin-bottom: 20px;
  }

  .lc1-details {
    height: 50px;
    font-size: 16px;
    display: flex;
    align-items: center;
    text-indent: 20px;

    span {
      color: #096dd9;
      font-weight: bold;
      font-size: 35px;
      margin-left: 20px;
    }
  }

  .lc1-chart {
    flex: 1;
  }
}
</style>
